.saniti01{
    -webkit-animation: cloud 3.5s linear infinite  alternate;
    animation: cloud 3.5s linear infinite  alternate;
}
.saniti02{
    -webkit-animation: cloud 2.8s linear  infinite 0.5s alternate;
    animation: cloud 2.8s linear  infinite  0.5s alternate;
}
.saniti03{
    -webkit-animation: cloud 3.5s linear  infinite  1s alternate;
    animation: cloud 3.5s linear  infinite  1s alternate;
}
.saniti04{
    -webkit-animation: cloud1 2s linear  infinite  1s alternate;
    animation: cloud1 2s linear  infinite  1s alternate;
}
.saniti05{
    -webkit-animation: cloud2 2s linear  infinite  1s alternate;
    animation: cloud2 2s linear  infinite  1s alternate;
}
@-webkit-keyframes cloud {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(-0.4rem,0);
        -webkit-transform: translate(-0.4rem,0);
    }
}

@keyframes cloud {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(-0.4rem,0);
        -webkit-transform: translate(-0.4rem,0);
    }
}

@-webkit-keyframes cloud1 {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(0.3rem,0);
        -webkit-transform: translate(0.3rem,0);
    }
}

@keyframes cloud1 {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(0.3rem,0);
        -webkit-transform: translate(0.3rem,0);
    }
}

@-webkit-keyframes cloud2 {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(0,0.4rem);
        -webkit-transform: translate(0,0.4rem);
    }
}

@keyframes cloud2 {
    0% {
        transform: translate(0,0);
        -webkit-transform: translate(0,0);
    }
    100% {
        transform: translate(0,0.4rem);
        -webkit-transform: translate(0,0.4rem);
    }
}
.heart{
    -webkit-animation: heart 1s linear infinite alternate;
    animation: heart 1s linear infinite alternate;
}
.heart2{
    -webkit-animation: heart 0.5s linear infinite alternate;
    animation: heart 0.5s linear infinite alternate;
}
.heart3{
    -webkit-animation: heart 0.8s linear infinite alternate;
    animation: heart 0.8s linear infinite alternate;
}
@-webkit-keyframes heart {
    from {
        transform: scale(1,1);
        -webkit-transform: scale(1,1);
    }
    to {
        transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
    }
}

@keyframes heart {
    from {
        transform: scale(1,1);
        -webkit-transform: scale(1,1);
    }
    to {
        transform: scale(1.1,1.1);
        -webkit-transform: scale(1.1,1.1);
    }
}
.circle01{
    animation: rotation 8s linear infinite reverse;
    -webkit-animation: rotation 8s linear infinite reverse;
}
.circleb02{
    -webkit-animation: circle02 4s linear .2s infinite alternate;
    animation: circle02 4s linear .2s infinite alternate;
}
.circles03{
    -webkit-animation: circle02 4s linear 1s infinite alternate;
    animation: circle02 4s linear 1s infinite alternate;
}

@keyframes rotation {
    from {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}
@-webkit-keyframes rotation {
    from {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}
@keyframes circle02 {
    from {
        transform: translate(0,-0.2rem);
        -webkit-transform: translate(0,-0.2rem);
    }
    to {
        transform: translate(0, 0.2rem);
        -webkit-transform: translate(0, 0.2rem);
    }
}
@-webkit-keyframes circle02 {
    from {
        transform: translate(0,-0.2rem);
        -webkit-transform: translate(0,-0.2rem);
    }
    to {
        transform: translate(0, 0.2rem);
        -webkit-transform: translate(0, 0.2rem);
    }
}
.atop{
    transition: all 2s;
    -webkit-transition: all 2s;
    transition-delay: 1.2s;
    -webkit-transition-delay: 1.2s;
    -webkit-animation:jumpY 3s .5s ease;
    -moz-animation:jumpY 3s .5s ease;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-iteration-count:infinite;
}
.atop2{
    transition: all 2s;
    -webkit-transition: all 2s;
    transition-delay: 1.2s;
    -webkit-transition-delay: 1.2s;
    -webkit-animation:jumpY2 3s .5s ease;
    -moz-animation:jumpY2 3s .5s ease;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-iteration-count:infinite;
}
@-webkit-keyframes jumpY {
    from {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    50% {
        -webkit-transform:translate(0,-0.22rem);
        transform:translate(0,-0.22rem);
    }
    to {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
}
@keyframes jumpY {
    from {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    50% {
        -webkit-transform:translate(0,-0.22rem);
        transform:translate(0,-0.22rem);
    }

    to {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
}
@-webkit-keyframes jumpY2 {
    from {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    50% {
        -webkit-transform:translate(0,0.22rem);
        transform:translate(0,0.22rem);
    }
    to {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
}

@keyframes jumpY2 {
    from {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    50% {
        -webkit-transform:translate(0,0.22rem);
        transform:translate(0,0.22rem);
    }

    to {
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
}